<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>js 魔塔游戏</title>
<link rel="stylesheet" type="text/css" href="css/mota.css">
</head>

<body>
<div class="mapwrap">
	<div class="welcome loading">
    	<div class="chapter">
			<p>在很久很久以前，在遥远的西方大地上，有这样一个王国。王国虽然小，但全国人民却非常快乐地生活着。</p>
            <p>突然有一天，天空中飞来一群可怕的怪物，它们来到王宫，抢走了国王唯一的女儿。 第二天，国王向全国下达了紧急命令，有谁能将公主救回来，就将王位让给他。</p>
            <p>于是，全国的勇士出发了，他们的足迹遍及了全国的每一个角落。可是，一个月过去了，一点线索也没有。</p>
            <p>终于，在国王下达命令的第31天，一位从远方归来的人说，在海边的一座小岛上，看到一群怪物出现过。</p>
            <p>这一次，勇士们又出发了。不过，据说这一次，没有一个勇士活着回来过.....</p>
        </div>
        <div class="page_wrap">
            <div class="new_load">
                <a href="javascript:" class="btn" id="new_game">新的游戏</a><br>
                <a href="javascript:" class="btn load_game" id="load_game_1">载入进度</a><br>
                <a href="javascript:" class="btn" id="game_setting">游戏设置</a>
            </div>
            <div class="game_helper">
                <a id="back" class="back" href="javascript:" title="返回">&lt;</a>
                <div class="new_game">
                    <input type="text" id="player_name" size="15" value="输入游戏角色名称" onFocus="this.value=this.value=='输入游戏角色名称'?'':this.value" onBlur="this.value=this.value==''?'输入游戏角色名称':this.value">
                    <a class="btn" id="startBtn" href="javascript:">开始游戏</a>
                </div>
                <div class="records" id="records">
                    <ul>
                        <li>Shaman 2012-12-11 10:43</li>
                        <li>空的记录</li>
                        <li>空的记录</li>
                    </ul>
                </div>
                <div class="setting" id="setting">
                    <ul>
                        <li>游戏速度： </li>
                        <li></li>
                        <li></li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="rights">
            <p>mota v2.0 beta, by <a href="http://www.shaman05.com" target="_blank">shaman</a> & <a href="http://orzfly.com">orzFly</a></p>
            <p>Recommends using <a href="http://browsehappy.com/">an Awesome Browser</a>.</p>
        </div>
	</div>
	<span id="toggle" class="toggle toggle_off"><span class="t_on" title="隐藏辅助面板">&laquo;</span><span class="t_off" title="显示辅助面板">&raquo;</span></span>
    <div id="map" class="map">
    </div>
    <div id="info" class="info">
    	<div class="info_col info_col_1">
        	<p><span><strong id="floor_index">0</strong>&nbsp;层</span></p>
            <p><span><strong id="player_rank">0</strong>&nbsp;级</span></p>
        </div>
        <div class="info_col info_col_2">
        	<p>
            	<span>生命 : <strong id="player_health">0</strong></span>
                <span>金钱 : <strong id="player_money">0</strong></span>
            </p>
            <p>
            	<span>攻击 : <strong id="player_attack">0</strong></span>
                <span>防御 : <strong id="player_defense">0</strong></span>
                <span>经验 : <strong id="player_expe">0</strong></span>
            </p>
        </div>
        <div class="info_col info_col_3">
        	<p><span class="key yellow_key_icon"><strong id="yellow_key">0</strong></span></p>
            <p><span class="key blue_key_icon"><strong id="blue_key">0</strong></span></p>
            <p><span class="key red_key_icon"><strong id="red_key">0</strong></span></p>
        </div>
    </div>
    <div id="pop_wrap" class="pop_wrap">
    </div>
</div>
<div class="debug" style="display:none">
	<div class="tab_h">
    	<span class="current">游戏信息</span><span>游戏帮助</span><span>关于游戏</span>
    </div>
    <div id="debug" class="tab_c">
	</div>
    <div class="tab_c" style="display:none">
    	<ol>
        	<li>使用键盘光标键 '<span class='shopKey'>&uarr;</span>' '<span class='shopKey'>&rarr;</span>' '<span class='shopKey'>&darr;</span>' '<span class='shopKey'>&larr;</span>' 控制角色移动。</li>
            <li>商店购物操作方法：键盘 '<span class='shopKey'>&uarr;</span>' 和 '<span class='shopKey'>&darr;</span>' 可以控制上下选择，按 '<span class='shopKey'>回车</span>' 确认选择。</li>
            <li>当角色获取到某一道具时，请注意使用该道具所用快捷键（【圣光徽】：'<span class='shopKey'>L</span>' , 【风之罗盘】：'<span class='shopKey'>J</span>'）</li>
            <li>角色移动至某一物品（道具）位置即可获取该物品（道具）</li>
            <li>地图的门有 '<span class='shopKey'>黄</span>' 、 '<span class='shopKey'>蓝</span>' 、 '<span class='shopKey'>红</span>' 三种颜色，每种颜色的门需要对应颜色的钥匙才能开启，特殊的门需要出发特定的情节或者打败守卫的怪物才能开启。</li>
            <li>关于战斗：由于尚未添加保存游戏功能，本版本中添加了智能判断胜负，如果当前能力不能打败怪物，会提醒玩家，不会触发战斗，确保角色安全 ：）</li>
            <li>已添加游戏保存功能（仅支持HTML5本地存储，不支持cookie）</li>
        </ol>
    </div>
    <div class="tab_c" style="display:none">
    	<p>去年年底项目完成后闲得蛋疼，想做点事情，就想搞个游戏什么的，本游戏起初是根据我手机里一个游戏《魔塔前传》改编，后来本人搜寻图片时发现已有魔塔v1.12的Flash游戏，也有一个网页js版的魔塔1.0，但是浏览器不兼容只能在IE下玩，游戏功能少，效果差，于是将图片资源拿过来用了，部分图片是1.0中没有的，就直接从Flash游戏中截图处理过来，所以游戏中部分图片会有瑕疵。</p>
        <p>由于时间原因，游戏优化和游戏地图后续部分(最后5层)有情节尚未完成，将持续更新。有兴趣的朋友如发现BUG，可以将问题描述到这里：<a href="https://github.com/Shaman05/mota/issues" target="_blank">js魔塔</a></p>
    </div>
    <div class="save_load">
        <select class="game_speed" id="game_speed">
            <option value="0" selected>选择战斗速度</option>
            <option value="1">慢速(1s/回合)</option>
            <option value="2">中等(0.5s/回合)</option>
            <option value="3">快速(0.2s/回合)</option>
            <option value="4">极快(50ms/回合)</option>
        </select>
        <a href="javascipt:" id="saveBtn" class="btn">保存游戏</a>
        <a href="javascipt:" id="loadBtn" class="btn">载入进度</a>
    </div>
</div>
<script type="text/javascript" src="./js/sea.js" data-main="main"></script>
</body>
</html>